{include file='/public/index-header'}
<body>
    {include file='/public/index-nav'}
    <div class="ws-container" style="background: rgba(0, 0, 0, 0) url(__ROOT__/static/plugs/index/img/lg-bg.jpg) no-repeat scroll center center / cover ;">
        <form class="layui-form" action="{:sysuri('index')}" id="loginForm" onsubmit="return false;" style="margin-top: 150px;" lay-filter="loginForm" data-auto="true">
            <div class="layui-form-item">
                <h1>{:lang('用&nbsp;户&nbsp;登&nbsp;录')}</h1>
            </div>
            
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <label class="layui-form-label">{:lang('账号')}：</label>
                    <input type="text" name="account" placeholder="{:lang('请输入账号')}" autocomplete="off" class="layui-input" style="width: 360px;" required>
                </div>
            </div>
    
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <label class="layui-form-label">{:lang('密码')}：</label>
                    <input type="password" name="password" placeholder="{:lang('请输入密码')}" autocomplete="off" class="layui-input" style="width: 360px;" required>
                </div>
            </div>
    
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <label class="layui-form-label">{:lang('验证码')}：</label>
                    <input type="text" name="verify" placeholder="{:lang('请输入验证码')}" class="input-val" autocomplete="off" style="width: 160px;margin-right: 10px;" required>
                    <label data-captcha="{:sysuri('login/captcha',[],false)}" data-field-verify="verify" data-field-uniqid="uniqid" data-captcha-type="{$captchaType}" data-captcha-token="{$captchaToken}"></label>
                </div>
            </div>

            <div class="layui-form-item">
                <div class="layui-inline" style="margin-left: 60px;">
                    <input type="checkbox" name="remember" lay-skin="primary" title="{:lang('记住密码')}">
                </div>
                <!-- <a href="{:sysuri('forget')}" style="float: right; margin-top: 7px;">忘记密码？</a> -->
            </div>

            <div class="layui-form-item">
                <div class="layui-btn-container" style="text-align: center;">
                    <button class="layui-btn layui-btn-normal btn layui-btn-radius layui-btn-lg" id="submitLogin" lay-submit lay-filter="submitLogin" style="margin-right: 30px;">{:lang('登 录')}</button>
                    <button class="layui-btn btn layui-btn-radius layui-btn-lg" id="register" style="margin-left: 30px;">{:lang('注 册')}</button>
                </div>
            </div>
        </form>

        <form class="layui-form layui-hide" action="{sysuri('register')}" id="registerForm" onsubmit="return false;" style="margin-top: 150px;" lay-filter="registerForm" data-auto="true">
			<div class="layui-form-item">
				<h1>{:lang('用&nbsp;户&nbsp;注&nbsp;册')}</h1>
			</div>
			
			<div class="layui-form-item">
				<div class="layui-input-block">
                    <label class="layui-form-label">{:lang('账号')}：</label>
					<input type="text" name="account" placeholder="{:lang('请输入账号')}" autocomplete="off" class="layui-input" style="width: 360px;" required>
				</div>
			</div>

			<div class="layui-form-item">
				<div class="layui-input-block">
                    <label class="layui-form-label">{:lang('手机号')}：</label>
					<input type="text" name="mobile" placeholder="{:lang('请输入正确的手机号')}" autocomplete="off" class="layui-input" style="width: 360px;" required pattern="mobile">
				</div>
			</div>

            <div class="layui-form-item">
				<div class="layui-input-block">
                    <label class="layui-form-label">{:lang('密码')}：</label>
					<input type="password" name="password" placeholder="{:lang('请输入密码,密码必须包含数字或字母或特殊符合')}" autocomplete="off" class="layui-input" style="width: 360px;" required vali-name="{:lang('密码')}">
				</div>
			</div>

			<div class="layui-form-item">
				<div class="layui-input-block">
                    <label class="layui-form-label">{:lang('确认密码')}：</label>
					<input type="password" name="check_password" placeholder="{:lang('请再次输入密码,密码必须包含数字或字母或特殊符合')}" autocomplete="off" class="layui-input" style="width: 360px;" required vali-name="{:lang('确认密码')}">
				</div>
			</div>
			<div class="layui-form-item">
				<div class="layui-btn-container" style="text-align: center;">
					<button class="layui-btn layui-btn-normal btn layui-btn-radius" id="submitRegister" lay-submit lay-filter="submitRegister" style="margin-right: 30px;">{:lang('注 册')}</button>
					<button class="layui-btn layui-btn-radius" type="button" style="margin-left: 30px;" data-href="{:sysuri('index')}">{:lang('登 录')}</button>
				</div>
			</div>
		</form>
    </div>
    {include file='/public/index-foot'}
</body>
<style type="text/css">

    .layui-input {
        height: 45px;
        padding-left: 5px;
        font-size: 16px;
        display: inline-block;
        
    }
    
    .layui-btn {
        height: 45px;
    }

    .layui-form {
        width: 590px;
        margin: 0 auto;
        margin-top: 20px;
        padding: 15px 28px 0px;
        background: #fff;
    }

    .layui-input-block {
        margin-left: 0;
    }
    
    .layui-input-block a {
        color: blue;
        float: right;
        line-height: 30px;
        font-size: 14px;
    }

    h1 {
        text-align: center;
        color: #1d598e;
    }

    input.text {
        text-align: center;
        padding: 10px 20px;
        width: 300px;
    }

    .input-val {
        height: 45px;
        font-size: 16px;
        border-radius: 5px;
        border: 1px solid rgba(0, 0, 0, .2);

    }
    .decrib{
        font-size: 16px;
    }
</style>
<script>
    $(function() {
        window.$body = $('body');
        let co_remember = getCookie('co_remember');
        if(co_remember){
            let co_account = getCookie('co_account');
            let co_password = getCookie('co_password');
            layui.form.val('loginForm', {
                'account': co_account,
                'password': co_password,
                'remember': co_remember
            });

        }

        /*! 后台加密登录处理 */
        layui.form.on('submit(submitLogin)', function (data) {
            let form_data = data.field;
            require(['md5'], function (md5) {
                    let pwd_txt = form_data['password'];
                    form_data['password'] = md5.hash(md5.hash(form_data['password']) + form_data['uniqid']);
                    $.form.load(location.href, form_data, "post", function (ret) {
                        let form_obj = '#loginForm';
                        if (parseInt(ret.code) !== 1) {
                            $(form_obj).find('[data-captcha]').trigger('click');
                            $(form_obj).find('.verify.layui-hide').removeClass('layui-hide');
                            $.msg.error(ret.info);
                            return false;
                        }else{
                            if(form_data['remember']){
                                setCookie('co_remember', 1, 7);
                                setCookie('co_account', form_data.account, 7);
                                setCookie('co_password', pwd_txt, 7);
                            }else{
                                delCookie('co_remember');
                                delCookie('co_account');
                                delCookie('co_password');
                            }
                            return true;
                        }
                    }, null, null, 'false');
            });
            return false;
        })

        /*! 登录图形验证码刷新 */
        $body.on('click', '[data-captcha]', function () {
            let $that = $(this), $form = $that.parents('form');
            let action = this.dataset.captcha || location.href;
            if (action.length < 5) return $.msg.tips('请设置验证码请求及验证地址');
            let type = this.dataset.captchaType || 'captcha-type', token = this.dataset.captchaToken || 'captcha-token';
            let uniqid = this.dataset.fieldUniqid || 'captcha-uniqid', verify = this.dataset.fieldVerify || 'captcha-verify';
            $.form.load(action, {type: type, token: token}, 'post', function (ret) {
                if (ret.code) {
                    // 每六分钟自动刷新验证码
                    $that.attr('timer') && clearTimeout($that.attr('timer'));
                    $that.attr('timer', setTimeout(() => $that.trigger('click'), 350000));
                    $that.html('<img alt="img" src="' + ret.data.image + '"><input type="hidden">').find('input').attr('name', uniqid).val(ret.data.uniqid || '');
                    $form.find('[name="' + verify + '"]').attr('value', ret.data.code || '').val(ret.data.code || '');
                    return (ret.data.code || $form.find('.verify.layui-hide').removeClass('layui-hide')), false;
                }
            }, false);
        });

        /*! 初始化登录图形 */
        $('[data-captcha]').map(function () {
            $(this).trigger('click');
        });

        // 注册切换
        $('#register').click(function(){
            $('#loginForm').addClass('layui-hide');
            $('#registerForm').removeClass('layui-hide');
            return false;
        })

        // 注册
        layui.form.on('submit(submitRegister)', function (data) {
            let form_data = data.field;
            $.form.load("{:sysuri('register')}", form_data, "post", function (ret) {
                
            }, true, null, '1');
            return false;
        });
    })
</script>